<template>
  <div style="margin-left: 100px; margin-right: 0vw">
    <!-- 公益小贴士 -->
    <div style="margin-bottom: 30px">
      <img
        style="vertical-align: middle"
        src="~/assets/image/charity/小贴士.png"
        alt=""
      />
      <span style="font-size: 20px">
        公益小贴士:请在发布信息前根据指示完成认证一系列操作！！！
        <!-- <el-row style="margin-top: 20px">
          <el-button
            type="warning"
            round
            @click="active = 1"
            v-if="active === 0"
            >发布求助信息</el-button
          >
          <el-button
            type="warning"
            round
            @click="toRouter('/charity/feedbackform')"
            >查看公示信息</el-button
          >
          <el-button
            type="warning"
            round
            @click="toRouter('/charity/publishpage')"
            >发布公示信息</el-button
          >
        </el-row> -->
      </span>
    </div>
    <div class="step">
      <!-- 进度条 -->
      <el-steps :active="active" finish-status="success">
        <el-step title="认证"></el-step>
        <el-step title="发布信息"></el-step>
        <el-step title="审核"></el-step>
      </el-steps>
    </div>
    <!-- 认证说明 -->
    <el-container>
      <el-main>
        <div>
          <p>
            如果您想要在本平台发起捐赠您需要完成个人身份认证操作，若您已经是本平台认证用户，请忽略认证操作！
          </p>
        </div>
      </el-main>
    </el-container>

    <!-- 认证表单 -->
    <!-- <identity @identityResult="identityRes" v-if="active === 0" /> -->
    <!-- 发布信息 -->
    <publish-information @publishResult="publishRes" v-if="active === 1" />
    <!-- 确认信息 -->
    <ensure-info v-else @per="pervious" :basicInfo="basicInfo" />
  </div>
</template>

<script>
// 引入认证资格组件
import Identity from "./publishInfo/Identity.vue";
// 引入发布信息组件
import PublishInformation from "./publishInfo/PublishInformation.vue";
// 引入确认信息组件
import EnsureInfo from "./publishInfo/EnSureInfo.vue";

import { getStuBaseInfoById } from "network/charity.js";
export default {
  data() {
    return {
      rId: "",
      active: 1,
      show3: true,
      basicInfo: {}
    };
  },
  components: { PublishInformation, EnsureInfo, Identity },
  methods: {
    //路由跳转
    toRouter(path) {
      this.$router.push(path);
    },
    //表单
    onSubmit() {
      console.log("submit!");
    },
    identityRes(index) {
      this.active = index;
      this.isIdentification = true;
    },
    publishRes(info) {
      this.active = info.active;
      this.basicInfo = info;
    },
    // 确认信息返回到第一步
    pervious(index) {
      this.active = index;
      console.log(this.active);
    },
    /**
     * @author DJG
     * @function 查询指定id学生基本信息
     */
    getStuBaseInfo(stuID) {
      getStuBaseInfoById(stuID).then(res => {
        if (res.basicInformationDonation) {
          this.basicInfo = res.basicInformationDonation;
          if (this.basicInfo.status == 1) {
            this.active = 3;
          }
        } else {
        }
      });
    }
  },
  created() {
    if (this.$route.query.id) {
      this.active = 2;
      this.rId = this.$route.query.id;
    }
    // 查询学生基本信息
    if(this.rId)
    this.getStuBaseInfo(this.rId);
  }
};
</script>

<style>
.step {
  margin-right: 80px;
  border: 2px solid gray;
  padding: 10px;
  border-radius: 5px;
  background-color: rgb(236, 196, 163);
}

.el-input__inner {
  width: 15vw;
}
</style>
